<script setup>
import useAssistantSettingStore from './AssistantStore';

defineProps({
    parsed_papers: {
        type: Array,
        required: false,
        default: []
    }
})

// 提交后端api表单数据
const assistantStore = useAssistantSettingStore()
</script>

<template>
<div class="tab-container">
    <el-form :model="assistantStore.assistantForm" label-width="auto">
        <el-form-item label="名称" required>
            <el-input v-model.trim="assistantStore.assistantForm.name"></el-input>
        </el-form-item>
        <el-form-item label="论文" required>
            <el-select v-model="assistantStore.assistantForm.paper_id" placeholder="" no-data-text="暂无数据" value-key="id">
                <template #prefix v-if="assistantStore.assistantForm.paper_id !== ''">
                    <el-icon style="width: 20px; height: 20px;"><Document /></el-icon>
                </template>
                <el-option v-for="p in parsed_papers"
                    :key="p.id"
                    :label="p.file_name"
                    :value="p.id">
                    <template #default>
                        <span style="display: flex; align-items: center; gap: 8px">
                        <el-icon><Document /></el-icon>
                        <span>{{ p.file_name }}</span>
                    </span>
                </template>
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="系统消息" required>
            <el-input type="textarea" 
            v-model="assistantStore.assistantForm.system_msg"
            style="width: 100%;" :autosize="{ minRows: 3, maxRows: 4 }" resize="none"
            placeholder="请输入内容"
        />
        </el-form-item>
    </el-form>
</div>
</template>

<style scoped>
.tab-container {
    width: 100%;
    height: 100%;
}
</style>